<template>
  <div id="cesiumContainer" class="cesium"></div>
</template>

<script>
  /* eslint-disable */
  export default {
    name: 'Cesium',
    data () {
      return {}
    },
    mounted () {
      new Cesium.Viewer(
			'cesiumContainer', {
				// scene3DOnly: true,
				sceneMode: Cesium.SceneMode.SCENE3D,
				shouldAnimate: true,
				baseLayerPicker: false,
				// terrainProvider: Cesium.createWorldTerrain({
				// 	requestWaterMask: false,
				// 	requestVertexNormals: false
				// }),
				imageryProvider: Cesium.createTileMapServiceImageryProvider({
					url: Cesium.buildModuleUrl('Assets/Textures/NaturalEarthII')
				}),
				imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
					url: "http://{s}.tianditu.com/img_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=img&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk=5b79423f82f9d691ff2608e24296f617",
					layer: "tdtBasicLayer",
					style: "default",
					format: "image/jpeg",
					tileMatrixSetID: "GoogleMapsCompatible",
					show: true,
					maximumLevel: 18,
					subdomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7']
				}),
				contextOptions: {
          webgl: {
              alpha: true
          }
        },
				terrainExaggeration: 2.0,
				requestRenderMode: true,
				maximumRenderTimeChange: Infinity,
				animation: false,
				fullscreenButton: false,
				geocoder: false,
				homeButton: false,
				infoBox: false,
				sceneModePicker: false,
				selectionIndicator: false,
				timeline: false,
				navigationHelpButton: false,
				navigationInstructionsInitiallyVisible: false
      })

      viewer.scene.camera.constrainedAxis = undefined; // Cartesian3.UNIT_Z;
      viewer._cesiumWidget._creditContainer.style.display = "none";

      //去掉双击事件

      viewer.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);

      viewer.scene.screenSpaceCameraController.zoomEventTypes = [Cesium.CameraEventType.WHEEL, Cesium.CameraEventType
        .PINCH
      ];
      viewer.scene.screenSpaceCameraController.tiltEventTypes = [Cesium.CameraEventType.PINCH, Cesium.CameraEventType
        .RIGHT_DRAG
      ];
    },
    components: {},
    methods: {}
  }
</script>

<style lang="less" rel="stylesheet/less" scoped>
  .cesium{
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
</style>
